<template>
  <div class="execution">
    <basic-container>
      <avue-crud v-bind="bindVal" v-on="onEvent" :page.sync="page" :permission="permissionList">
        <template slot="menuLeft">
          <el-button type="primary" size="small" @click="handleConfirm"
            v-permission="permissionList.confirmBtn">确 认</el-button>
          <el-button type="primary" size="small" @click="handleExport"
            v-permission="permissionList.exportBtn">导 出</el-button>
          <el-button type="primary" size="small" :hidden="true" v-if="false" @click="handlePrint"
            v-permission="permissionList.printBtn">打 印</el-button>
        </template>
        <template slot="menu" slot-scope="{row, index}">
          <el-button type="text" size="small"
            icon="el-icon-view"
            @click="handleView(row, index)">预 览
          </el-button>
        </template>
      </avue-crud>
      <open-dialog title="预 览" :DialogVisible.sync="dialogVisible">
        <avue-form v-model="form" :option="formOption"></avue-form>
        <dynamic-crud :title="crudTitle" :data="detailList"
          :option="dynamicOption" :button="false" :tableLoading="detailLoading">
        </dynamic-crud>
      </open-dialog>
    </basic-container>
  </div>
</template>

<script>
  import baseCrud from '@/mixins/base-crud'
  import {confirm} from '@/api/subwaystm/swsttemporarydistributionplannotice'
  import {getDetailObj,getHandDetailObj} from "@/api/subway/swtkticketdelivery"
  import { numberFormat } from '@/util/util.js'

  export default {
    name: 'swsttemporarydistributionplannotice',
    mixins: [baseCrud('subwaystm/swsttemporarydistributionplannotice')],
    data() {
      return {
        dialogVisible: false,
        detailList: [],
        detailLoading: false,
        crudTitle: '',
        searchForm: {
          noticeConfirm: '0'
        }
      }
    },
    computed: {
      permissionList() {
        return {
          // addBtn: this.vaildData(this.permissions.stm_sw_st_temporary_distribution_plan_notice_add, false),
          // delBtn: this.vaildData(this.permissions.stm_sw_st_temporary_distribution_plan_notice_del, false),
          // editBtn: this.vaildData(this.permissions.stm_sw_st_temporary_distribution_plan_notice_edit, false)
          confirmBtn: this.vaildData(this.permissions.stm_sw_st_temporary_distribution_plan_notice_confirm, false),
          exportBtn: this.vaildData(this.permissions.stm_sw_st_temporary_distribution_plan_notice_export, false),
          printBtn: this.vaildData(this.permissions.stm_sw_st_temporary_distribution_plan_notice_print, false)
        };
      },
      formOption(){
        let isDistribution = this.form.distributionType == '0'
        return {
          menuBtn: false,
          detail: true,
          column: [{
            label: isDistribution ? '配送人':'回收人',
            prop: 'distributionPersonName'
          }, {
            label: isDistribution ? '配送人工号' : '回收人工号',
            prop: 'distributionPersonCode'
          }, {
            label: isDistribution ? '配送时间' : '回收时间',
            prop: 'distributionTime'
          }]
        }
      },
      dynamicOption(){
        let isDistribution = this.form.distributionType == '0'
        return {
          column: [{
            label: '票种',
            prop: 'ticketType',
            dicUrl: '/support/swpmticketcardtype/dict',
            props: {
              label: 'mainName',
              value: 'mainEnName'
            }
          }, {
            label: '车票名称',
            prop: 'ticketTypeParam',
            dicUrl: '/support/swpmticketcardtypeparam/dictAll/{{key}}',
            props: {
              label: 'subName',
              value: 'subEnName'
            }
          },
            {
              "label": "车票种类",
              "prop": "ticketReturnType",
              type: 'select',
              dicUrl: '/admin/dict/type/TICKET_RETURN_TYPE',
              // cell: this.isHandleResultEditable,
              cell: true,
              disabled: true,
              filterable: true,
              allowCreate: false,
              width: 110
            },
            {
            label: '号段',
            prop: 'numberInterval'
          }, {
            label: '卡号',
            prop: 'cardNumber'
          }, {
            label: '金额',
            prop: 'ticketAmount',
            type: 'number',
            precision: 2,
            formatter: (row,value,label,column) => {
              return numberFormat(value, column.precision)
            }
          }, {
            label: '次数',
            prop: 'ticketCount'
          }, {
            label: isDistribution ? '配送张数' : '回收张数',
            prop: 'deliveryCount'
          }, {
            label: isDistribution ? '接收张数' : "实际回收张数",
            prop: 'receiveCount'
          }, {
            label: '差异张数',
            prop: 'differenceCount'
          }, {
            label: '备注',
            prop: 'remark',
          }]
        }
      }
    },
    methods: {
      handleConfirm(){
        var tableSelect = this.$refs.crud.tableSelect
        if(tableSelect.length == 0){
          this.$message.info('请选择要确认的记录')
          return
        }
        var ids = tableSelect.map(row => row.id)
        confirm(ids).then(response => {
          this.$message.success('确认成功')
          this.getList(this.page)
        })
      },
      handleView(row, index){
        this.form = row
        if(row.distributionType == '0'){
          this.crudTitle = '配送明细信息'
          this.detailList = []
          this.detailLoading = true
          getDetailObj(this.form.refId).then(response => {
            this.detailList = response.data.data.swTkTicketDeliveryDetails
            this.detailLoading = false
          })
          this.dialogVisible = true
        }else{
          this.crudTitle = '回收明细信息'
          this.detailList = []
          this.detailLoading = true
          getHandDetailObj(this.form.refId).then(response => {
            this.detailList = response.data.data.swStTicketHandDetails
            this.detailLoading = false
          })
          this.dialogVisible = true
        }
      }
    }
  }
</script>
